<template>
    <div class="app-container">

        <SearchContent :queryParams="queryParams" @query="handleQuery" @reset="resetQuery">
            <el-col :span="6">
                <el-form-item label="车架号:" prop="vinNo">
                    <el-input v-model="queryParams.vinNo" clearable placeholder="请输入车架号"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="车牌号:" prop="carNo">
                    <el-input v-model="queryParams.carNo" clearable placeholder="请输入车牌号"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="车辆归属:" prop="ascription">
                    <el-input v-model="queryParams.ascription" clearable placeholder="请输入车辆归属"></el-input>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="来源:" prop="purchaseSource">
                    <el-select v-model="queryParams.purchaseSource" clearable>
                        <el-option v-for="dict in dict.type.in_storage_source" :label="dict.label" :value="dict.value"
                            :key="dict.value"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="业务类型:" prop="businessScopeCode">
                    <el-select v-model="queryParams.businessScopeCode" clearable>
                        <el-option label="全部" :value="0"></el-option>
                        <el-option label="自营" :value="1"></el-option>
                        <el-option label="渠道" :value="2"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="状态:" prop="storageStatus">
                    <el-select v-model="queryParams.storageStatus" clearable>
                        <el-option label="全部" :value="0"></el-option>
                        <el-option label="待入库" :value="1"></el-option>
                        <el-option label="已入库" :value="2"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="客户名称:" prop="customerName">
                    <el-input v-model="queryParams.customerName" clearable placeholder="请输入客户名称"></el-input>
                </el-form-item>
            </el-col>

        </SearchContent>

        <div class="card-wrap paddingAll20" :model="queryParams" label-width="86px">
            <div class="table-title-wrap justify-end">
                <el-button type="primary" size="mini" @click="handleExport"
                    v-hasPermi="['carInventory:inInventory:export']">导出
                </el-button>
            </div>

            <table-page :loading="loading" :dataList="dataList" :total="total" :page.sync="queryParams.pageNum"
                :limit.sync="queryParams.pageSize" @setSizeCurrent="getList" border>
                <!-- 操作插槽 -->
                <template slot="tableColAc">
                    <el-table-column label="操作" align="center" class-name="small-padding fixed-width" min-width="160px">
                        <template v-slot="{ row }">
                            <e-button v-if="row.saveFlag !== 2" size="mini" type="text" @click="handleOperate(1, row)"
                                v-hasPermi="['carInventory:inInventory:edit']">入库
                            </e-button>
                            <e-button size="mini" type="text" @click="handleOperate(4, row)"
                                v-hasPermi="['carInventory:inInventory:detail']">查看
                            </e-button>
                        </template>
                    </el-table-column>
                </template>
                <!-- 普通列插槽 -->
                <template slot="tableCol">
                    <el-table-column label="业务单号" align="center" prop="businessNo" min-width="180px"
                        show-overflow-tooltip />
                    <el-table-column label="子订单编号" align="center" prop="orderNo" min-width="180px"
                        show-overflow-tooltip >
                        <template v-slot="{ row }">
                            <span class="goorder" @click="goOrder(row.orderCarCode)">{{ row.orderCarCode }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="客户名称" align="center" prop="customerName" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="来源" align="center" prop="purchaseSource" min-width="120px" show-overflow-tooltip>
                        <template v-slot="{ row }">
                            <dict-tag :options="dict.type.in_storage_source" :value="row.purchaseSource" />
                        </template>
                    </el-table-column>
                    <el-table-column label="采购编号" align="center" prop="purchaseNo" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="品牌" align="center" prop="brandName" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="车架号" align="center" prop="vinNo" min-width="150px" show-overflow-tooltip />
                    <el-table-column label="车牌号" align="center" prop="carNo" min-width="120px" show-overflow-tooltip />
                    <el-table-column label="业务类型" align="center" prop="value" min-width="120px" show-overflow-tooltip>
                        <template v-slot="{ row }">
                            <dict-tag :options="dict.type.business_type" :value="row.businessScope" />
                        </template>
                    </el-table-column>
                    <el-table-column label="车辆归属" align="center" prop="ascription" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="状态" align="center" prop="createTime" min-width="120px"
                        show-overflow-tooltip>
                        <template v-slot="{ row }">
                            <dict-tag :options="dict.type.in_storage_status" :value="row.inStorageStatus" />
                        </template>
                    </el-table-column>
                    <!-- <el-table-column label="审核节点" align="center" prop="createTime" min-width="120px" show-overflow-tooltip/> -->
                    <el-table-column label="审核状态" align="center" prop="auditStatus" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="操作人" align="center" prop="updateBy" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="操作时间" align="center" prop="updateTime" min-width="120px"
                        show-overflow-tooltip />
                </template>
            </table-page>

        </div>

    </div>
</template>

<script>
import SearchContent from "@/components/SearchContent/index.vue";
import * as inInventoryApi from "@/api/carInventory/inInventory";
import * as outInventoryApi from "@/api/carInventory/outInventory";
export default {
    name: "InInventoryList",
    components: {
        SearchContent,
    },
    dicts: ['business_type', 'purchase_source', 'in_storage_status', 'in_storage_source'],
    data() {
        return {
            // 遮罩层
            loading: false,
            retutnCarTimes: [],
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                vinNo: null,
                carNo: null,
                ascription: null,
                purchaseSource: null,
                businessScopeCode: null,
                storageStatus: null,
                customerName: null,
            },
            total: 0,
            dataList: []

        };
    },
    mounted() {
        this.getList()
    },
    activated() {
        this.handleQuery()
    },
    methods: {
         // 详情
         goOrder(orderCode){
            if (this.Empty(orderCode)) return;
            return new Promise(resolve => {
                outInventoryApi.outOrderDetails(orderCode)
                .then(res => {
                    if (res.code == 200) {
                        this.$router.push({
                            name: "SuborderDetail",
                            query: {
                            id: res.data.orderCarId,
                            orderId: res.data.orderCode
                            },
                        });
                    } else {
                    throw new Error(res);
                    }
                })
            .catch(err => resolve());
        });
        },
        /** 查询列表 */
        getList() {
            this.loading = true;
            let param = JSON.parse(JSON.stringify(this.queryParams))
            if(param.storageStatus==0){
                param.storageStatus = ''
            }
            if(param.businessScopeCode==0){
                param.businessScopeCode = ''
            }
            inInventoryApi.inStorageList(param).then(res => {
                this.dataList = res.rows;
                this.total = res.total;
            }).finally(() => {
                this.loading = false
            })
        },

        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },

        /** 重置按钮操作 */
        resetQuery() {
            this.queryParams = {
                pageNum: 1,
                pageSize: 10,
                vinNo: null,
                carNo: null,
                ascription: null,
                purchaseSource: null,
                businessScopeCode: null,
                storageStatus: null,
                customerName: null,
            },
                this.handleQuery();
        },


        handleOperate(type, row) {
            switch (type) {
                case 1://入库
                    this.$router.push({
                        name: 'InInventory',
                        query: {
                            inboundId: row.inboundId,
                            viewType: 0,
                            source: row.purchaseSource == '4' ? 1 : 2,// 用来判断显示采购信息还是外部转租赁（4）
                        }
                    })
                    break
                case 3://作废
                    this.deleteRow(row)
                    break
                case 4://查看
                    this.$router.push({
                        name: 'InInventoryDetail',
                        query: {
                            inboundId: row.inboundId,
                            viewType: 0,
                            source: row.purchaseSource == '4' ? 1 : 2,// 用来判断显示采购信息还是外部转租赁
                        }
                    })
                    break

            }
        },
        deleteRow(row) {
            this.$confirm('此操作将作废该入库单, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                inInventoryApi.deleteInStorage(row.inboundId).then(res => {
                    this.handleQuery()
                    this.$message.success('作废成功')
                })
            })
        },
        // 导出
        handleExport() {
            this.download('/inStorage/exportList', {
                ...this.queryParams
            }, `入库列表_${new Date().getTime()}.xlsx`)
        }

    }
};
</script>
<style scoped>
    .goorder{
        color:blue;
        cursor: pointer;
    }
</style>
